<template>
    <view class="stu-details">
		<view class="stu-bg">
			<image :src="`/static/role${userinfo.sex==1?1:''}.png`" mode="widthFix"></image>
		</view>
        <view class="st-content">
            <view class="info">
                    
                <view class="name-head">
                    <view class="avatar-head">
                        <image class="head" :src="utils.headImage(userinfo)" mode="aspectFill"></image>
                    </view>
                    <view class="name">{{userinfo.name}}
                        <image class="sex" :src="`/static/sex${userinfo.sex}.png`" mode=""></image>
                    </view>
                    
                </view>
                <!-- <view class="cla-grade">
                    <text>班   级：{{orgGraders[studentInfo.clasId]}}</text>
                </view> -->
                <!-- <view class="number">
                    <text><text class="num">{{studentInfo.zScore}}</text>积分</text>
                    <text><text class="num">{{detailsInfo.rewardCount}}</text>获奖</text>
                    <text><text class="num">{{detailsInfo.recommendCount}}</text>推荐</text>
                    <text><text class="num">{{detailsInfo.starCount}}</text>月度之星</text>
                </view> -->
            </view>
        </view>
    </view>
</template>
<script>
export default {
    data() {
        return {
            userinfo: {}
        }  
    },
    onLoad(){
        this.getMeInfo()
    },
    methods: {
        getMeInfo(){
            this.api.get('tUser/getMeInfo').then(res=>{
                // this.userInfo = res.data.admin;
                // getApp().globalData.userInfo = this.userInfo
            })
        },
    }
}
</script>
<style lang="less" scoped>
.stu-bg{
    background-color: #9ad1f8;
    text-align: right;
    padding: 32rpx 60rpx 0;
    // #ifdef H5
    margin-top: -44px;
    padding-top: 44px;
    // #endif
    
    image{
        width: 190rpx;
    }
}
.st-content{
    position: relative;
    margin-top: -380rpx;
    
    background-color: #fff;
    border-radius: 10rpx 10rpx 0 0;
}
.info{
    border-radius: 10rpx 10rpx 0 0;
    padding: 10rpx 0 50rpx 64rpx;
    border-bottom: 20rpx solid #f2f2f2;
    .avatar-head{
        padding: 15rpx;
        background-color: #fff;
        margin-right: 24rpx;
        border-radius: 80rpx;
        font-size: 0;
    }
    .name-head{
        margin-top: -56rpx;
        display: flex;
        align-items: center;
    }
    .head{
        width: 130rpx;
        height: 130rpx;
        border-radius: 65rpx;
    }
    .name{
        color: #000;
        font-size: 36rpx;
        .sex{
            margin-left: 8rpx;
            vertical-align: 8rpx;
            width: 28rpx;
            height: 28rpx;
        }
    }
    .cla-grade{
        white-space: pre-wrap;
        margin-top: 16rpx;
        color: #7f7f7f;
        line-height: 38rpx;
        font-size: 24rpx;
    }
    .number{
        margin: 50rpx 64rpx 0 0;
        display: flex;
        justify-content: space-between;
        color: #7f7f7f;
        .num{
            color: #000;
            margin-right: 8rpx;
        }
    }
}
</style>